<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-staff-add">
        <div class="form-group">
            <label class="col-sm-3 control-label">人员编号：</label>
            <div class="col-sm-8">
                <input id="staffNo" name="staffNo" class="form-control" type="text">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">姓名：</label>
            <div class="col-sm-8">
                <input id="staffName" name="staffName" class="form-control" type="text">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">年龄：</label>
            <div class="col-sm-8">
                <input id="age" name="age" class="form-control" type="number">
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">性别：</label>
            <div class="col-sm-8">
                <select id="sex" name="sex" class="form-control">
                    <option value="1" >男</option>
                    <option value="2">女</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">所属机构：</label>
            <div class="col-sm-8">
                <input id="treeId" name="deptId" type="hidden"/>
                <input class="form-control" type="text" onclick="selectDept()" id="treeName" name="deptName"
                       readonly="true"/>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">职能：</label>
            <div class="col-sm-8">
                <input id="ccName" name="ccName" class="form-control" type="hidden">
                <select id="ccId" name="ccId" class="form-control" onchange="getItemName(this)">
                    <option value="">--选择职能--</option>
                    <option th:each="item : ${classificationList}" th:value="${item.id}" th:text="${item.ccName}"></option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">帐号状态：</label>
            <div class="col-sm-8">
                <div class="radio-box" th:each="dict : ${@dict.getType('sys_normal_disable')}">
                    <input type="radio" th:id="${dict.dictCode}" name="status" th:value="${dict.dictValue}"
                           th:checked="${dict.isDefault == 'Y' ? true : false}">
                    <label th:for="${dict.dictCode}" th:text="${dict.dictLabel}"></label>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">备注：</label>
            <div class="col-sm-8">
                <input id="remark" name="remark" class="form-control" type="text">
            </div>
        </div>
    </form>
</div>
<div th:include="include::footer"></div>
<script th:inline="javascript">
    var prefix = ctx + "system/staff";
    var ccList = [[${classificationList}]] ;
    $("#form-staff-add").validate({
        rules: {
            ccId: {
                required: true,
            },
        }
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/add", $('#form-staff-add').serialize());
        }
    }

    function getItemName(ele) {
        var ccId = $(ele).val();
        if(ccId){
            $.each(ccList,function (i, e) {
                if(ccId == e.id){
                    $("#ccName").val(e.ccName);
                    return false;
                }
            });

        }
    }
</script>
</body>
</html>
